import React from "react";
import { HashRouter, Route, Link, Switch } from "react-router-dom";

interface Iprops {}

const RouteDome1: React.FC<Iprops> = () => (
	<HashRouter>
		<div>
			<ul>
				<li>
					<Link to="/">HOME</Link>
				</li>
				<li>
					<Link to="/about">ABOUT</Link>
				</li>
				<li>
					<Link to="/topic">TOPIC</Link>
				</li>
			</ul>
			<div>
				<Switch>
					<Route exact={true} path="/" component={Main}></Route>
					<Route path="/about" component={About}></Route>
					<Route path="/topic" component={Topic}></Route>
				</Switch>
			</div>
		</div>
	</HashRouter>
);

const Main: React.FC = () => <div>this is Main page</div>;

const About: React.FC = () => <div>this is About page</div>;

const Topic: React.FC = () => <div>this is Topic page</div>;

// const aa:<p>()=>string = function():string{
//     return ''
// }

export default RouteDome1;
